<!DOCTYPE html>
<html class="x-admin-sm">

<head>
<meta charset="UTF-8">
<title>帮我取</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="stylesheet" href="../../css/font.css">
<link rel="stylesheet" href="../../css/xadmin.css">
<script type="text/javascript" src="../../lib/layui/layui.js"
	charset="utf-8"></script>
<script type="text/javascript" src="../../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
<!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>

<body>
	<div class="layui-fluid">
		<div class="layui-row">
			<form class="layui-form">

				<div class="layui-input-inline layui-show-xs-block">
					<label for="takeDictType" class="layui-form-label">物品信息 </label>
					<div class="layui-input-inline">
						<select id="takeDictType" name="takeDictType" lay-verify="required"
							class="select">
						</select>
					</div>
				</div>


			
				<div class="layui-form-item">
					<label for="takePhone" class="layui-form-label"> <span
						class="x-red">*</span>手机
					</label>
					<div class="layui-input-inline">
						<input type="text" id="takePhone" name="takePhone" required=""
							lay-verify="phone" autocomplete="off" class="layui-input">
					</div>
				</div>
				<div class="layui-form-item">
					<label for="takeAddr" class="layui-form-label"> <span
						class="x-red">*</span> 取货地址
					</label>
					<div class="layui-input-inline">
						<input type="text" id="takeAddr" name="takeAddr" required=""
							lay-verify="required" autocomplete="off" class="layui-input">
					</div>
				</div>

				<div class="layui-form-item">
					<label for="takeDeliverAddr" class="layui-form-label"> <span
						class="x-red">*</span>送达地址
					</label>
					<div class="layui-input-inline">
						<input type="text" id="takeDeliverAddr" name="takeDeliverAddr"
							required="" lay-verify="required" autocomplete="off"
							class="layui-input">
					</div>
				</div>

				
				<div class="layui-form-item">
					<label for="orderAnnotation" class="layui-form-label"> <span
						class="x-red">*</span>备注
					</label>
					<div class="layui-input-inline">
						<input type="text" id="orderAnnotation" name="orderAnnotation"
							required="" lay-verify="required" autocomplete="off"
							class="layui-input">
					</div>
				</div>

				<div class="layui-form-item">
					<label for="payOption" class="layui-form-label"> <span
						class="x-red">*</span>支付方式
					</label>
					<div class="layui-input-inline">
						<select name="payOption">
							<option>支付方式</option>
							<option>支付宝</option>
							<option>微信</option>
							<option>余额</option>
						</select>
					</div>
				</div>

				<div class="layui-form-item">
					<button class="layui-btn" lay-filter="onOrders" lay-submit="">立即下单</button>
				</div>
			</form>
		</div>
	</div>
	<script>
		layui.use([ 'form', 'layer', 'table', 'layedit', 'laydate' ],
				function() {
					$ = layui.jquery;
					var form = layui.form, layer = layui.layer;
					var table = layui.table;

					initSelect(form);

					//监听提交
					form.on('submit(onOrders)', function(data) {
						console.log("data数据：", data);
						$.ajax({
							//请求方式
							type : "POST",
							//请求的媒体类型
							//contentType: "application/json;charset=UTF-8",
							//请求地址
							url : "/take/add",
							//数据，(json字符串 JSON.stringify(data)),
							data : data.field,
							//请求成功
							success : function(result) {
								if (result > 0) {
									//发异步，把数据提交给springmvc
									layer.alert("增加成功", {
										icon : 6
									}, function() {
										// 获得frame索引
										var index = parent.layer
												.getFrameIndex(window.name);
										//关闭当前frame
										parent.layer.close(index);

										parent.location.reload();//刷新父页面更新修改后的表格数据
									});
								} else {
									//发异步，把数据提交给
									layer.alert("增加失败！", {
										icon : 6
									});
								}
							}
						});
						return false;
					});

				});

		let optionData;

		function initSelect(form) {

			/* 调用获取下拉框数据的方法 */
			findOptionByDictType("帮我取", form);

		}

		/**
		 * 获得条件下拉框
		 * @param {Object} type  下拉框类型
		 * @param {Object} form
		 */
		function findOptionByDictType(type, form) {
			var dictId;
			$.post("/dict/findDictByDictTypeList", {
				"dictType" : type
			}, function(res) {
				/*console.log(res);*/
				if (type === "帮我取") {
					dictId = "#takeDictType"; //帮我取
				}
				$(dictId).append(new Option(type, "0"));
				$.each(res, function(index, item) {
					$(dictId).append(new Option(item.dictItem, item.dictId));
				});

				//重新渲染
				form.render("select");
			}, 'json');
		}
	</script>

</body>

</html>